<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>title</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui_font.css" />
    <link rel="stylesheet" type="text/css" href="../css/news.css" />
    <link rel="stylesheet" type="text/css" href="../css/base_icon.css" />
    <link rel="stylesheet" type="text/css" href="../css/frame3.css" />
    <link rel="stylesheet" type="text/css" href="../css/swiper.css" />
    <style>
        html,
        body {
            background-color: #f5f5f5;
            padding-bottom: 30px;
        }
        .panel{
            background-color: #ffffff;
        }

        .info{
            padding: 13px 20px 13px 20px;
            display: flex;
            justify-content: flex-start;
        }
        .info .avatar{
            width: 43px;
            height: 43px;
            border-radius: 100px;
        }
        .info .msg{
            color: #666666;
            font-size: 16px;
            margin-left: 10px;
        }
        .sam{
            font-size: 11px;
            margin-left: 10px;
        }
        .sam img{
            width: 60px;
        }
        .wenzi{
            color: #999;
            font-size: 11px;
        }
        .tequan{
            display: flex;
            justify-content: flex-start;
            flex-wrap: wrap;
            text-align: center;
        }
        .quan{
            width: 33%;
            margin-bottom: 10px;
        }
        .lays{
            display: flex;
            justify-content: space-between;
            text-align: center;
            /* background-color: #7338d8; */
            border-radius: 5px;
            padding: 2px;
            margin: 10px;
            padding-bottom: 0px;
        }
        .layl{
            display: flex;
            justify-content: flex-start;
            text-align: center;
        }
        .ti{
            color: #D5BBC2;
            font-size: 14px;
            margin-left: 5px;
        }
        .kaibtn{
            /* color: #3B3233; */
            font-size: 12px;
            background-color: #f2dbe0;
            padding: 0 12px;
            border-radius: 100px;
        }
        .card-box{
            padding: 0 10px 5px 10px;
            display: flex;
            justify-content: space-between;
        }
        .card1{
            width: 49%;
            height: 59px;
            background: url('../image/zhibo/l1.png') 0 0 no-repeat;
            background-size: contain;
            padding-top: 13px;
        }
        .card2{
            width: 49%;
            height: 59px;
            background: url('../image/zhibo/l2.png') 0 0 no-repeat;
            background-size: contain;
            padding-top: 13px;
        }
        .card1 p, .card2 p{
            color: #fff;
            font-size: 11px;
            margin-left: 10px;

        }
        .tip{
            background-color: #fff;
            border-radius: 5px;
            margin: 10px;
            padding: 10px;
        }
        .wenzit{
            color: #666;
            margin-top: 2px;
            font-size: 12px;
        }
        .tequant{
            display: flex;
            justify-content: space-evenly;
            flex-wrap: wrap;
            text-align: center;
            align-items: center;
        }
        .quant{
            width: 25%;
            margin-bottom: 10px;
        }
        .quant img{
            width: 40px;
            height: 40px;
        }
        .one{
            display: flex;
            justify-content: flex-start;
            padding-top: 15px;
        }
        .ic{
            width: 22px;
            height: 22px;
            margin: 0 5px;
        }
        .right{
            flex: 1;
            border-bottom: 1px solid #DADADA;
            margin-left: 8px;
            padding: 0 0 15px 0;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .one:last-child .right{
            border-bottom: none;
        }
        .subtitle{
            color: #333;
            font-size: 14px;
        }
        .zuo{
            width: 15px;
            height: 15px;
        }
        .righly{
            color: #7d7d7d;
            font-size: 10px;
            display: flex;
            justify-content: flex-start;
            align-items: center;
        }
        .tabbar{
            position: fixed;
            left: 0;
            bottom: 0;
            width: 100%;
            padding: 5px 0 10px 0;
            background-color: #FAF8FB;
            display: flex;
            justify-content: space-around;
            align-items: center;
        }
        .tab{

            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .tab img{
            width: 20px;
            margin-bottom: 5px;
        }
        .tab span{
            color: #999999;
            font-size: 10px;
        }
        .on span{
            color: #C087F3;
        }
        .name-wrap{
            display: flex;
            align-items: center;
        }
    </style>
</head>

<body>
<div id="view" v-cloak>
    <div class="panel">

        <div class="info" onclick="_url({},'frame4/ucenter')">
            <img class="avatar" :src="returnImg(listData.head_portrait)" onerror="this.src='../image/touxiang.png'">

            <div>
                <div class="msg name-wrap">

                    <span v-if="listData.is_noble && listData.noble" style="color: red;" class="name">{{ listData.name}}</span>
                    <span v-else class="name">{{ listData.name}}</span>


                    <span class="new-tag man-ntag" :class="{'woman-ntag':listData.user_sex=='女'}" v-if="listData.realname_auth==2"></span>
                    <span class="new-tag rz-tag" v-if="listData.is_identity_authentication==2"></span>
                    <!-- <img v-if="listData.is_crown && listData.crown" class="new-noble" :src="returnImg(listData.crown.icon)" onerror="this.src='../image/error-img.png'" alt=""> -->
                    <img v-if="listData.is_noble && listData.noble" class="new-noble" :src="returnImg(listData.noble.icon)" onerror="this.src='../image/error-img.png'" alt="">
                </div>
                <div class="sam">
<!--                     <span v-if="listData.charmIcon || listData.tycoonIcon || listData.is_noble">-->
<!--                        <span v-if="listData.tycoonIcon && !ios"><img :src="returnImg(listData.tycoonIcon)" onerror="this.src='../image/error-img.png'" alt=""></span>-->
<!--                        <span v-if="listData.charmIcon && !ios"><img :src="returnImg(listData.charmIcon)" onerror="this.src='../image/error-img.png'" alt=""></span>-->
<!--                     </span>-->
                    <span>{{_i18n('牵友号')}}：{{listData.id}}</span>

                </div>
            </div>
        </div>
        <div class="tequan">
            <div class="quan" onclick="_url({url:'frame4/collect_frame', title:'好友', types: 3})">
                <p class="wenzi">{{listData.friend || 0}}</p>
                <p class="wenzi">好友</p>
            </div>
            <div class="quan" onclick="_url({url:'frame4/collect_frame', title:'关注', types: 1})">
                <p class="wenzi">{{listData.following || 0}}</p>
                <p class="wenzi">关注</p>
            </div>
            <div class="quan" onclick="_url({url:'frame4/collect_frame', title:'粉丝', types: 2})">
                <p class="wenzi">{{listData.attention || 0}}</p>
                <p class="wenzi">粉丝</p>
            </div>
        </div>
        <div class="lays" onclick="_url({url:'frame4/yaoqing', title:'我的邀请'})">
            <div class="" >
                <img src="../image/zhibo/yaoqing.png" style="width: 100%;">
            
            </div>
            
        </div>
        <div class="card-box">
            <div class="card1" onclick="_url({url: 'frame4/wo_de_yu_e_frame', title: '收益', moreTitle:'清单'})">
                <p>{{listData.score_price}}</p>
                <p>钱包</p>
            </div>
            <div class="card2"  v-if="coin_open == 1" onclick="_url({url:'frame4/chongzhicenter',title:'充值中心', moreTitle: '账单'})">
                <p>金币充值</p>
                <p>限时特惠</p>
            </div>
        </div>
    </div>
    <div class="tip">
        <div class="tequant">
            <div class="quant" onclick="_url({url:'rz/rzcenter', title:'认证'})">
                <img src="../image/member/mm3.png" alt="">
                <p class="wenzit">我的认证</p>
            </div>
            <div class="quant" onclick="_url({}, 'frame4/visitor_win')">
                <img src="../image/member/mm6.png" alt="">
                <p class="wenzit">谁看过我</p>
            </div>
<!--            <div class="quant" onclick="_url({url: 'frame4/wo_de_yu_e_frame', title: '收益', moreTitle:'清单'})">-->
<!--                <img src="../image/zhibo/m3.png" alt="">-->
<!--                <p class="wenzit">收益</p>-->
<!--            </div>-->
            <div class="quant" @click="_url({
                url: 'frame4/broadcast_frame',
                title: '我的动态',
                uid: listData.id
            })">
                <img src="../image/zhibo/m4.png" alt="">
                <p class="wenzit">我的动态</p>
            </div>
        </div>
    </div>
    <div class="tip">
        <div class="one"   v-if="vip_open == 1" onclick="_url({url:'zhibo/svip',title:'黑卡会员'})">
        <img src="../image/zhibo/h1.png" class="ic">
            <div class="right">
                <div class="subtitle">黑卡会员</div>
                <img src="../image/zhibo/zuo.png" class="zuo">
            </div>
        </div>

        <!-- <div class="one"  v-if="listData.sex == '女'"  onclick="_url({url:'frame4/bangding',title:'上传绑定', moreTitle:'绑定列表'})">
            <img src="../image/member/mm7.png" class="ic">
                <div class="right">
                    <div class="subtitle">上传绑定</div>
                    <img src="../image/zhibo/zuo.png" class="zuo">
                </div>
        </div> -->

        <div class="one" onclick="_url({url:'frame4/renwu',title:'每日任务'})">
            <img src="../image/member/mm2.png" class="ic">
            <div class="right">
                <div class="subtitle">每日任务</div>
                <img src="../image/zhibo/zuo.png" class="zuo">

            </div>
        </div>
        <div class="one" v-if="listData.sex == '女'" onclick="_url({url:'zhibo/mylist',title:'我的视频'})">
            <img src="../image/zhibo/h3.png" class="ic" >

            <div class="right">
                <div class="subtitle">我的视频</div>
                <img src="../image/zhibo/zuo.png" class="zuo">
            </div>
        </div>
        <div class="one" @click="_url({url:'frame4/helpcenter', title:'设置', phone: listData.phone})">
            <img src="../image/member/mm9.png" class="ic">
            <div class="right">
                <div class="subtitle">帮助中心</div>
                <img src="../image/zhibo/zuo.png" class="zuo">
            </div>
        </div>
        <div class="one" onclick="_url({url: 'frame4/yi_jian_fan_kui_frame', title: '投诉与建议'})">
          <img src="../image/member/mm7.png" class="ic">
            <div class="right">
                <div class="subtitle">投诉与建议</div>
                <img src="../image/zhibo/zuo.png" class="zuo">
            </div>
        </div>
        <div class="one" onclick="openService()">
          <img src="../image/icon/kficon@2x.png" class="ic">
            <div class="right">
                <div class="subtitle">客服</div>
                <img src="../image/zhibo/zuo.png" class="zuo">
            </div>
        </div>
        <!-- <div class="one" v-if="listData.sex == '女'" onclick="_url({url:'frame3/wechat', title:_i18n('我的微信号')})">
            <img src="../image/icon/wxic@3x.png" class="ic">
            <div class="right">
                <div class="subtitle">设置微信号</div>
                <img src="../image/zhibo/zuo.png" class="zuo">
            </div>
        </div> -->
        <div class="one" @click="_url({url:'frame3/sz', title:'设置', phone: listData.phone})">
            <img src="../image/member/mm8.png" class="ic">
            <div class="right">
                <div class="subtitle">系统设置</div>
                <img src="../image/zhibo/zuo.png" class="zuo">
            </div>
        </div>
    </div>
</div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/jquery.js"></script>
<script type="text/javascript" src="../script/vue.js"></script>
<script type="text/javascript" src="../script/ffkj.js"></script>
<script type="text/javascript" src="../script/update.js"></script>
<script type="text/javascript" src="../script/swiper.js"></script>

<script type="text/javascript" src="../json/imglist.js"></script>
<script type="text/javascript" src="../json/user.js"></script>
<script type="text/javascript" src="../json/rw.js"></script>
<script type="text/javascript">
    var userid;
    var closeid;
    var imgurls = [];
    var view = new Vue({
        el: '#view',
        data: {
            listData: {
                proxy: 0
            },
            imgUrl: imgurl,
            imgList: [],
            bigImgList: [],
            upType: 0, // 0图片 1视频
            ios: 1, // 1上架 0非上架
            vip_open: 0,
            coin_open: 0,
            vipdate: [],
            rwList: rwJson.data[0],

            showNoble: 0,
        },
        methods: {
            copyTxt(text) {
                copyTxt(text);
            },
            _url(param, url) {
                _url(param, url);
            },
            // 返回图片路径
            returnImg(url) {
                return returnImg(url);
            },
        }
    });
    var swiper = new Swiper('.swiper-container', {
        direction: 'vertical', // 垂直切换选项
        loop: true, // 循环模式选项
        autoplay: {
            delay: 3000,
        },
        allowTouchMove: false,
    })
    apiready = function() {
        view.ios = $api.getStorage('shang');
        userid = $api.getStorage('userid');
        $api.fixStatusBar($api.dom('header'));
        //监听登录
        // _listener('fresh', function () {
        //     userid = $api.getStorage('userid');
        //     getUserInfo();
        // })
        if (api.systemType == 'ios') {
            userid = $api.getStorage('userid');
            getUserInfo();
            _heibai(1);
        }
        _listener('viewappear', function() {
            userid = $api.getStorage('userid');
            getUserInfo();
            _heibai(1);
        })

        api.addEventListener({
            name:'pause'
        }, function(ret, err){        
            //alert('应用进入后台');
            set_user_pause();
        });


        _shangla(function() {
            userid = $api.getStorage('userid');
            getUserInfo();
            _heibai(1);
        }, 1)

        setTimeout(function() {
            getSign()
        }, 2000)
    };

    function goToGonghui(){
        api.openDrawerLayout({
            name: 'gonghui_win',
            url: html_win + 'gonghui/gonghui_win.html',
            pageParam:{
                title: '首页',
                url: 'gonghui/index'
            },
            rightPane:{
                edge: 160,
                name: 'gonghui_slide',
                url: html_win + 'gonghui/slide.html',
                pageParam:{
                    title: '首页'
                }
            }
        })
    }

    // 获取用户信息
    function getUserInfo() {
        _getUser(function(ret) {

            var userAgent = navigator.userAgent;
            var isiOS = !!userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
            var isAndroid = userAgent.indexOf('Android') > -1 || userAgent.indexOf('Adr') > -1;

            if(isAndroid == true){
                view.vip_open = ret.result.vip_open;
                view.coin_open = ret.result.coin_open;
            }else if(isiOS == true){
                view.vip_open = ret.result.ios_vip_open;
                view.coin_open = ret.result.ios_coin_open;
            }


            console.log(isiOS)
            console.log(isAndroid)
            view.listData = ret.result;
         
          
            var nd = new Date().getDate();
            if ($api.getStorage('showNoble') != nd) {
                $api.setStorage('showNoble', nd);
                view.showNoble = ret.result.noble_grade;
                setTimeout(function() {
                    view.showNoble = 0;
                }, 3000)
            }
        })
    }

    // 联系客服
    function openService() {
        _ajax('api/Member/kefu', function(ret, err) {
            if (ret && ret.data && ret.data.id) {
                _url({
                    touserid: ret.data.id,
                    title: '与客服的聊天',
                    moreType: 1,
                }, 'frame0/liaotian_win')
            } else {
                _msg('暂无法联系客服');
            }
        })
    }


    // 获取签到状态
    function getSign() {
        // if ($api.getStorage('shang') == 1) return;
        // _ajax('api/task/checkSignIn', function(ret, err) {
        //     if (ret && ret.data && !ret.data.signIn) {
        //         showDetail('modal/sign_modal')
        //     }
        // }, {
        //     user_id: $api.getStorage('userid')
        // })
    }
</script>

</html>